
 <style type="text/css">
   .input-group .img-responsive{
      width: 250px;
   }
   .muban-list{
    padding: 3% 0;
   }
   .muban-list .muban-radio{
    margin: 3% auto 0;
  }
  .muban-tu img{ 
      height:auto;
  }
  .we7-table td{
    text-align: center;
  }
  .muban_td td img{
    width:50px;
    height:50px;
  } 
 </style>
{template 'common/header-base'}

{if $op=="display"}
<div class="pull-right">
    <a href="{php echo $this->createWeburl('muban_show', array('op'=>'post'))}"  class="btn btn-primary we7-padding-horizontal" style="margin-bottom: 20px">添加主题样式</a>
</div>
<form class="form-horizontal" action="" method="post">
    <table class="table we7-table table-hover article-list vertical-middle">
        <tr>
            <td>ID</td>
            <td>模板名称</td>
            <td>首页主题样式</td>
            <td>会员中心主题样式</td>
            <td>知识百科样式选择</td>
            <td>服务人员样式列表选择</td>
           <!--  <td>模板展示图</td> -->
            <td>默认选中</td>
            <td class="text-right">操作</td>
        </tr>
        {loop $products $item}
        <tr class="muban_td">
            <td>
                {$item['m_id']}
            </td>
             <td>
                {$item['title']}
            </td>
            <td>
                <img src="{$item['show']}" style="width:50px;height:60px;">
            </td>
            <td>
                <img src="{$item['huiyuan']}" style="width:50px;height:60px;">
            </td>
            <td>
                <img src="{$item['zhishi']}" style="width:50px;height:60px;">
            </td>
            <td>
                <img src="{$item['fuwu']}" style="width:50px;height:60px;">
            </td>
            <!-- <td>
                <img src="{media $item['thumb']}" style="width:50px;height:60px;">
            </td> -->
            <td>
                {if $item['select']=='1'}<a class="btn btn-info btn-sm" href="#" >选中</a>{/if}
                {if $item['select']=='0'}<a class="btn btn-default btn-sm" href="#" >未选中</a>{/if}
            </td>
            <td class="text-right">
                <a class="btn btn-default btn-sm" href="{php echo $this->createWeburl('muban_show', array('id' => $item['m_id'], 'op' =>'post'))}" >编辑</a>
                <a class="btn btn-default btn-sm" onclick="return confirm('此操作不可恢复，确认吗？'); return false;" href="{php echo $this->createWeburl('muban_show', array('id' => $item['m_id'], 'op' => 'delete'))}">删除</a>
            </td>
        </tr>
        {/loop}
    </table>
</form>
{/if}
{if $op=="post"}

<div class="box">
  <form class="form-horizontal" action="" method="post">
    <table style="margin-top:20px">
      <tr>
        <td style="border-right:1px solid #ddd;padding-left: 10px">
          <div class="form-group muban" id="muban" style="text-align: center">
            <p class="muban-title">首页主题样式选择</p>
            <div class="muban-lists row">
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2" style="width: 50%;">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/index01.png" alt=""/></div>
                  <div class="muban-radio">
                    <input type="radio" id="index1" name="index" value="1" hidden ret="{$items['show']}"/>
                    <label for="index1">index1</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/index02.png" alt=""/></div>
                  <div class="muban-radio">
                    <input type="radio" id="index2" name="index" value="2" hidden  ret="{$items['show']}"/>
                    <label for="index2">index2</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
        <td style="border-right:1px solid #ddd;padding-left: 10px">
           <div class="form-group muban" id="muban" style="text-align: center">
            <p class="muban-title">会员中心主题样式</p>
            <div class="muban-lists row">
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2" style="width: 50%;">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/huiyuan01.png" alt=""/></div>
                  <div class="muban-radio">
                    <i></i>
                    <input type="radio" id="huiyuan" name="huiyuan" value="1" hidden ret="{$items['huiyuan']}"/>
                    <label for="index1">index1</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/huiyuan02.png" alt=""/></div>
                  <div class="muban-radio">
                    <i></i>
                    <input type="radio" id="huiyuan" name="huiyuan" value="2" hidden ret="{$items['huiyuan']}"/>
                    <label for="index2">index2</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
      
        <td style="border-right:1px solid #ddd;padding-left: 10px">
          <div class="form-group muban" id="muban" style="text-align: center">
            <p class="muban-title">知识百科样式选择</p>
            <div class="muban-lists row">
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2" style="width: 50%;">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/zhishi01.png" alt=""/></div>
                  <div class="muban-radio">
                    <i></i>
                    <input type="radio" id="zhishi" name="zhishi" value="1" hidden ret="{$items['zhishi']}"/>
                    <label for="index1">index1</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/zhishi02.png" alt=""/></div>
                  <div class="muban-radio">
                    <i></i>
                    <input type="radio" id="zhishi" name="zhishi" value="2" hidden ret="{$items['zhishi']}"/>
                    <label for="index2">index2</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
        <td style="border-right:1px solid #ddd;padding-left: 10px">
          <div class="form-group muban" id="muban" style="text-align: center">
            <p class="muban-title">服务人员样式列表选择</p>
            <div class="muban-lists row">
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2" style="width: 50%;">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/fuwu02.png" alt=""/></div>
                  <div class="muban-radio">
                    <i></i>
                    <input type="radio" id="fuwu" name="fuwu" value="2" hidden ret="{$items['fuwu']}"/>
                    <label for="index2">index2</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
              <div class="col-xs-6 col-sm-4 col-md-2 col-lg-2">
                <div class="muban-list" style="width:150px">
                  <div class="muban-tu"><img src="/addons/hyb_o2oyuyue/style/images/img/fuwu01.png" alt=""/></div>
                  <div class="muban-radio">
                    <i></i>
                    <input type="radio" id="fuwu" name="fuwu" value="1" hidden ret="{$items['fuwu']}"/>
                    <label for="index1">index1</label>
                  </div>
                  <div class="muban-zhezhao">
                    <span>立即使用</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </td>
      </tr>
      <tr>
        <td colspan="4">
           <div class="form-group muban" >
              <p class="muban-title">模板设置</p>
              <div class="muban-lists row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                  <div class="form-group">
                        <label for="" class="control-label col-sm-1" >模板名称</label>
                         <div class="form-controls col-sm-5" style="margin-left: 75px;">
                            <input type="text" id="title" name="title" value="{$items['title']}" class="form-control ng-pristine ng-untouched ng-valid ng-empty"  placeholder="" autocomplete="off">
                        </div>
                        <div class="col-sm-1"></div>
                        <div class="form-controls col-sm-4 help-block">模板名称</div>
                  </div>
                </div>
                <!-- <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                  <div class="form-group">
                        <label for="" class="control-label col-sm-1">模板展示图</label>
                          <div class="col-sm-1"></div>
                        <div class="form-controls col-sm-5" style="margin-left: 75px;">
                            {php echo tpl_form_field_image('thumb', $items['thumb'])}
                        </div>
                        <div class="col-sm-1"></div>
                        <div class="form-controls col-sm-4 help-block">模板展示图(建议 518X689px)</div>
                    </div>
                </div> -->
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                  <div class="form-group">
                        <label for="" class="control-label col-sm-1">是否设置为默认选中</label>
                        <!-- <div class="col-sm-1"></div> -->
                        <div class="form-controls col-sm-5" style="margin-left: 75px;">
                          <select name="select" id="select" class="form-control">
                                <option value="">--请选择--</option>
                                <option value="1" {if $items['select']=="1"}selected{/if} >选中</option>
                                <option value="0" {if $items['select']=="0"}selected{/if} >不选中</option>
                            </select>
                        </div>
                        <div class="col-sm-1"></div>
                        <div class="form-controls col-sm-4 help-block">默认选中选中</div>
                    </div>
                </div>
              </div>
            </div> 
        </td>
      </tr>
      <tr>
        <td colspan="4" align="center">
          <div class="form-group surebtn">
              <div class="col-sm-12">
                  <input name="token" type="hidden" value="{$_W['token']}" />
                  <input type="submit" class="btn btn-primary col-lg-1" name="submit" value="提交" style="margin-left: 32%;width: 30%;" />
              </div>
          </div>
        </td>
      </tr>
    </table>
  </form>
</div>
{/if}
<script type="text/javascript">  
  $(document).ready(function(){
      $("input[type*='radio']").each(function(){
        var aa=($(this).val());
        var ret=$(this).attr('ret');
        if(aa == ret){
           $(this).parent().parent().addClass("der");
        }
       });
    $("#muban div span").on("click",function(){
      $(this).parent().prev().children("input").attr("checked","true");
      $(this).parent().prev().children("i").addClass("bac");
      console.log($(this).parent().prev().children("i"));
      $(this).parent().parent().addClass("der");
      $(this).parent().parent().parent().siblings().children().removeClass("der");
      $(this).parent().parent().parent().siblings().children().children("div.muban-radio").children("i").removeClass("bac");
      $(this).parent().parent().parent().parent().siblings().children().children().removeClass("der");
      $(this).parent().parent().parent().parent().siblings().children().children().children("div.muban-radio").children("i").removeClass("bac");
      var mid=$(this).parent().prev().children("input").val();
    });
  });
</script>

